<header local-class='projects-header {{if @project "withProject"}}'>
  <div local-class='content'>
    <div local-class='content-left'>
      <div local-class='applicationLogo'>
        {{inline-svg 'assets/logo.svg' local-class='applicationLogo-image'}}
        <span local-class='applicationLogo-accent'>
          {{t 'general.application_name'}}
        </span>
      </div>
    </div>

    {{#if @project}}
      <div local-class='content-center'>
        <div local-class='search'>
          {{inline-svg '/assets/search.svg' local-class='search-icon'}}
          <input
            {{on 'keyup' this.setDebouncedQuery}}
            local-class='search-input'
            type='text'
            placeholder={{t 'general.search_input_placeholder_text'}}
            value={{this.debouncedQuery}}
          />
        </div>
      </div>
    {{/if}}

    {{#if @session.credentials.user}}
      <div local-class='content-right'>
        {{#if @session.credentials.user.pictureUrl}}
          <AccAvatarImg local-class='picture' src={{@session.credentials.user.pictureUrl}} />
        {{/if}}

        <span local-class='username'>
          {{@session.credentials.user.fullname}}
        </span>

        {{#unless @project}}
          <button class='button button--white' {{on 'click' (fn this.logout)}}>
            {{t 'general.logout_button'}}
          </button>
        {{/unless}}
      </div>
    {{/if}}
  </div>
</header>